<template>
    <div class="audit-task-detail-view">

      <el-form ref="elForm" :model="datas" size="small" label-width="110px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="项目编号：">
              <div>{{project.project_no}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="项目名称：">
              <div>{{project.project_name}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="项目负责人：">
              <div>{{project.project_person_in_charge}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="任务编号：">
              <div>{{datas.task_no}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="任务名称：">
              <div>{{datas.task_name}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="父任务：" v-if="datas.level != 1">
              <div>{{datas.parent_name}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="前置任务：" v-if="datas.level != 1">
              <div>{{datas.foreground_task_name?datas.foreground_task_name:'无'}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="工期（天）：">
              <div>{{datas.duration}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计划开始时间：">
              <div>{{datas.start_date ? dateFormat1('yyyy-mm-dd',datas.start_date) : ""}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计划结束时间：">
              <div>{{datas.end_date ? dateFormat1('yyyy-mm-dd',datas.end_date) : ""}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="实际开始时间：">
              <div>{{datas.real_start_date ? dateFormat1('yyyy-mm-dd',datas.real_start_date) : ""}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="实际结束时间：">
              <div>{{datas.real_end_date ? dateFormat1('yyyy-mm-dd',datas.real_end_date) : ""}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="任务负责人：">
              <div v-if="datas.person_in_charge">{{datas.person_in_charge.member_name}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="任务参与人：">
              <div v-if="datas.task_member" style="display: flex">
                <div v-for="(item,index) in datas.task_member">
                  <span>{{item.member_name}}</span>
                  <span v-if="index != datas.task_member.length-1">,</span>
                </div>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="阶段性评审：">
              <div>{{datas.periodical_review?"是":"否"}}</div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="强制验收：">
              <div>{{datas.mandatory_check?"是":"否"}}</div>
            </el-form-item>
          </el-col>

        </el-row>

      </el-form>

      <el-table
        v-if="datas.files && datas.files.length"
        size="medium"
        :data="datas.files"
        align="center"
        border
        style="width: 100%">
        <el-table-column
          align="center"
          prop="file_name"
          label="文档名称">
        </el-table-column>
        <el-table-column
          align="center"
          prop="type_name"
          label="文档类型">
        </el-table-column>
        <el-table-column
          align="center"
          label="申报所需文件">
          <template slot-scope="scope">
            <span>{{scope.row.need?'是':'否'}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="是否提交"
          width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.file && scope.row.file.id">是</span>
            <span v-else>否</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="操作">
          <template slot-scope="scope">

            <div class="btn-view">
              <el-button v-if="scope.row.file && scope.row.file.id" size="medium" type="text" @click="checkClick(scope.row.id)">
                查看
              </el-button>

              <el-button v-if="scope.row.file && scope.row.file.id" size="medium" type="text" icon="el-icon-download" @click="downloadClick(scope.row.id)">
                下载
              </el-button>
            </div>

          </template>
        </el-table-column>
      </el-table>

      <pdf-and-png-dialog ref="pdf"></pdf-and-png-dialog>

    </div>
</template>

<script>
    import pdfAndPngDialog from "../../../modules/pdfAndPngDialog";
    import {fileEditFun,filePreviewFun,downloadFun} from "../../../../../utils/file";
    export default {
        name: "taskDetailView",
        components:{pdfAndPngDialog},
        props:{
            datas:{
                type:Object,
                default:function () {
                    return{
                        task_before:{},
                        task_after:{}
                    }
                }
            },
            project:Object,
            isDisable:{
                type:Boolean,
                default:function () {
                    return false;
                }
            }
        },
        methods:{
            checkClick:function (id) {
                let index = this.datas.files.findIndex(a=>a.id == id)
                if (index != -1){


                    let file = JSON.parse(JSON.stringify(this.datas.files[index]))

                    const suffix = file.file.suffix.toLowerCase()

                    if (suffix === '.jpg' || suffix === '.jpeg' || suffix === '.png' || suffix === '.pdf'){
                        if (this.$refs.pdf){
                            this.$refs.pdf.openDialog(file.file);
                        }

                    }else {
                        filePreviewFun(file.file)
                    }
                }
            },
            downloadClick:function (id) {
                let index = this.datas.files.findIndex(a=>a.id == id)
                if (index != -1){


                    let file = {...this.datas.files[index]}

                    downloadFun(file.file)
                }
            }
        }
    }
</script>

<style scoped>

</style>
